<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
  <script src="https://cdn.bootcss.com/vue/2.6.10/vue.js"></script>
  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
  <div id="d1" class="container">
    <h3></h3>
    <table class="table table-striped">
      <tr>
        <th>学号</th><th>姓名</th><th>班级</th><th>成绩</th>
      </tr>
      <tr v-for="s in a">
        <td>{{s.sno}}</td><td>{{s.sname}}</td><td>{{s.cno}}</td><td>{{s.score}}</td>
      </tr>
    </table>
    <ul class="pagination">
      <li><a>&laquo;</a></li>
      <li class="active"><a @click="getc(1)">1</a></li>
      <li><a @click="getc(2)">2</a></li>
      <li><a>&raquo;</a></li>
    </ul>
  </div>
  <script>
    // var arr
    new Vue({
      "el": "#d1",
      "data": {
        a : null
      },
      // 绑定
      mounted:function (){
        //绑定的
        axios
                .get("stus/1")
                .then(
                        response => (this.a = response.data)
                )
      },
      methods:{
        getc:function (c) {
        //   axios
        //           .get("stus/" + c)
        //           .then(
        //                   response => (this.a = response.data)
        //           )
        alert(c)
        }
      }
    })
  </script>
</body>

</html>